body {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    width:100%;
    height:100%;
    background-size:cover;
}

.main {
    flex: 1;
}
div.head{
    position:fixed; /* 绝对定位，fixed是相对于浏览器窗口定位。 */
    top:0; /* 距离窗口顶部距离 */
    left:0; /* 距离窗口左边的距离 */
    width:100%; /* 宽度设置为100% */
    height:60px; /* 高度 */
    z-index:99; /* 层叠顺序，数值越大就越高。页面滚动的时候就不会被其他内容所遮挡。 */
    box-shadow: 2px 2px 5px #5a5a5a;
    background-color:#ffffff78;
}
div.head-text{
    text-align: center;
    width: 200px;
    height: 30px;
    margin: auto;
    position: absolute;
    top:4px;
    bottom:7px;
    left: 43%;
    color: black;
    font-weight: 200;
    font-size: 24px;
    font-family: "微软雅黑";
}
div.content{
position: absolute;
top: 160px;
left: 17%;
width: 70%;
height: 400px;
font-weight: 100;
}
div.box1{

margin: 20px;
width: 30%;
text-align: center;
float: left;
border: 2px black;
}
div.box2{
margin: 20px;
width: 30%;
text-align: center;
float: right;
border: 2px black;
}

.tail
{
    width: 100%;
    height: 10%;
    opacity: 0.9;
    right: 0;
    text-align: center;
    font-weight: 100;
    font-family: "Times New Roman",Georgia,Serif;
    font-size: 15px;
}

li{
    list-style: none;
}
a{
    text-decoration:none;
    color: black;
}
img.logo
{
    margin-left:40%;
    width:60px;
    height:100%;
    float:left;
}
img.icon
{
    width:60px;
    margin-top: 37%;
}